<template>
  <div class="page view-logistics">
    <div class="scroll-view">
      <customHeader middleTitle="查看物流">
      </customHeader>
      <div class="page-body">
        <div class="info" v-if="resultObject.sendOutNum">
          <i class="zhk-bf-svg"></i>
          <span>{{resultObject.sendOutNum}}个设备已发出</span>
        </div>
        <ul class="ulform-style" v-for="(itemList,index) in resultObject.machineLists" :key="index">
          <li class="order-time" v-if="itemList.logisticsCode" @click="doCopy(itemList.logisticsCode)">
            <!-- <span>2018</span> -->
            <div>{{itemList.logisticsName}}：{{itemList.logisticsCode}}</div>
          </li>
          <li class="order-time" v-if="!itemList.logisticsCode">
            <span class="col-red">待发货</span>
          </li>
          <li class="order-list">
            <div class="shop-name" v-if="itemList.shopName">
              <i class="zhk-md" />
              <span>{{itemList.shopName}}</span>
            </div>
            <div class="context-box">
              <div class="context-left">
                <img class="mainImg" :src="devicePic(itemList.machineType)" alt="" />
              </div>
              <div class="context-right">
                <div>
                  <span class="text-left">{{itemList.machineTypeName}}</span>
                  <!-- <span class="text-right">¥ 99.99</span> -->
                </div>
                <div>
                  <!-- <span class="text-left">描述</span> -->
                  <!-- <span class="text-right">x10</span> -->
                  <!-- <span class="text-right">查看物流</span> -->
                </div>
              </div>
            </div>
            <!-- <div class="logistics-blue" v-if="status==1" @click="logisticsInfo">已发货</div> -->
            <!-- <div class="logistics-gray" v-if="status==2">未发货</div> -->
          </li>
        </ul>
      </div>
    </div>
  </div>
</template>

<script>
import Vue from "vue";
import config from "../../base/profile/config.json";
import customHeader from "../../components/header/header";
import { MessageBox,Toast } from "mint-ui";
import VueClipboard from "vue-clipboard2";
Vue.use(VueClipboard);

export default {
  name: "viewLogistics",
  data() {
    return {
      // imgUrl: {
      //   ImgUrl1: require("../../../static/images/machines/maxiansheng.png")
      // },
      orderStateList: {
        orderState: 1
      },
      equipmentNum: 10,
      // status: 1,
      logisticsCompany: "顺丰快递", //物流公司
      trackingNumber: "5555555555555555555", //快递单号
      goodsTime: "2018-12-4 17:24",
      resultObject: {},
      deviceInfo:[],
    };
  },
  methods: {
    doCopy(content) {
      if (!content) {
        return;
      }
      this.$copyText(content).then(
        e => {
          Toast("复制成功");
        },
        e => {
          Toast("您的系统版本过低,请长按手动复制");
        }
      );
    },
     devicePic(machineType) {
      let img = "./static/images/machines/defaultMachine.png";
      for (const e of this.deviceInfo) {
        if (e.machineType == machineType&&e.thumbnail){
          img = config.shopImgUrlPrefix + e.thumbnail;
          break;
        }
      }
      return img;
      //return require(`../../../static/images/machines/${window.CommonUtil.devicePic(machineType)}`);
    },
    // 获取物流信息
    getLogisticsInfo() {
      const param = {
        orderId: this.$route.query.orderId
      };
      this.ajax({
        url: "app/orderService/logistics.do?orderId=" + param.orderId,
        type: "get",
        data: param,
        controlLoading: true
      })
        .then(res => {
          if (res.success&&res.resultObject) {
            this.resultObject = res.resultObject;
          }else{
            Toast(res.msg);
          }
        })
        .catch(err => {
          Toast(err.msg);
        });
    },
    //物流信息
    logisticsInfo() {
      MessageBox({
        title: "物流信息",
        message: "物流公司：" + this.logisticsCompany + "<br/>快递单号：" + this.trackingNumber + "<br/>发货时间：" + this.goodsTime,
        showCancelButton: true,
        confirmButtonText: "复制单号"
      }).then(action => {
        if (action === "confirm") {
          //复制单号
          this.$copyText(this.trackingNumber).then(function(e) {}, function(e) {});
        }
      });
    }
  },
  created() {
    CommonUtil.getDeviceInfo().then(data => {
        this.deviceInfo = data;
        this.getLogisticsInfo();
    });
  },
  components: {
    customHeader
  }
};
</script>
<style lang='scss' scoped>
@import "mall";
</style>
